import React from "react";
import styled from "@emotion/styled";
const Child = styled.div`
    color:red
`
//通过${}{}去定义特定的子组件,比方说${Child}{color:green},当这个子组件被Father包裹的时候应用里面的样式
const Father = styled.div`
    ${Child}{
        color:green
    }
`
// const Father = styled.div({
//     [Child]: {
//         color: 'green'
//     }
// })
export default function CssFC() {
    return (
        <>
            <Child>子组件单独使用</Child>
            <Father><Child>子组件被父组件包裹</Child></Father>
        </>
    )
}